/* Custom CSS for Enlarging Post Width and Styling the Post Title */

/* In assets/css/post_custom.css */



/* Post title styling */
.page__title {
  font-family: 'Arial', sans-serif;  /* Change the font of the title (can be customized) */
  font-weight: bold;  /* Make the title bold */
  font-size: 2.5em;   /* Increase the font size */
  color: #333;        /* Title color */
  margin-bottom: 10px; /* Space below the title */
  border-bottom: 2px solid #ccc;  /* Horizontal line below the title */
  padding-bottom: 10px; /* Padding below the title */
}

/* Body content font styling */
body {
  font-family: 'Georgia', serif;  /* Change the font of the body (can be customized) */
  font-size: 21px; /* Increase the font size for better readability */
  line-height: 1.6;  /* Line height for readability */
  color: #333;       /* Text color */
  margin-top: 20px;
}

/* Adjust for smaller screen sizes (responsiveness) */
@media (max-width: 768px) {
  .container {
    max-width: 100%;  /* Full width for mobile */
  }
  .post-title {
    font-size: 2em;  /* Adjust title size on smaller screens */
  }
  body {
    font-size: 1.1em;  /* Slightly smaller body text on mobile */
  }
}